<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1"/>
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <title>星盘解读</title>
    <link rel="stylesheet" href="/static/astro_explain/css/swiper.min.css">
    <link rel="stylesheet" href="/static/astro_explain/css/style.css?v=1.0">
</head>
<body onselectstart="return false;">
<div id="top">
    <div class="swiper-container" id="nav">
        <div class="swiper-wrapper">
            {if is_array($data) && !empty($data)}
            {foreach $data as $vo}
            <div class="swiper-slide">
                <span>{$vo.planet['name']}</span>
            </div>
            {/foreach}
            {/if}
        </div>
    </div>
    <div class="bar">
        <div class="color"></div>
    </div>
</div>

<div class="swiper-container" id="page">
    <img src="/static/astro_explain/images/PLANET@2x.png" class="img-head">
    <div class="swiper-wrapper">
        {foreach $data as $k=>$vo}
        <!-- list1 太阳 -->
        <div class="swiper-slide slidepage">
            <div class="page_container">
                <!-- 向上的三角形 -->
                <div class="triangle_border_up" style="border-color:transparent transparent {$vo.planet['header_color']};">
                    <span></span>
                </div>
                <!-- 太阳 -->
                <div class="totle">
                    <div class="content_con">
                        <div class="banner" style="background-color: {$vo.planet['color']};border-radius: 10px;">
                            <div class="headImg">
                                <img src="{$vo.planet['img']}">
                            </div>
                            <div class="headFont" style="background-color: {$vo.planet['color']};">
                                <div class="headFont2">
                                    <br>
                                    <p>{$vo.planet['des']}</p><br>
                                </div>
                            </div>
                        </div>
                        <div class="luogong" style="margin-top: 24px;">
                            <span><img src="/static/astro_explain/images/标题style@2x.png" style="width: 10px;height: 15px;"></span><span
                                style="margin-left: 10px;margin-right: 10px;padding-bottom: 10px;font-size: 18px;color: #333333;">落宫落座</span><span><img
                                src="/static/astro_explain/images/标题style@2x.png" style="width: 10px;height: 15px;"></span>
                        </div>
                        {if is_array($vo.sign['text']) && !empty($vo.sign['text'])}
                        <div class="content2" style="margin-top: 10px;">
                                  <span class="icon">
                                    <img src="{$vo.sign['icon']}" style="height: 50px;width: 50px;">
                                  </span>
                            <span class="title">你的{$vo.planet['name']}落在{$vo.sign['name']}</span>
                            {foreach $vo.sign['text'] as $text}
                            <div class="wenzi">
                                <p>{$text}</p><br><br>
                            </div>
                            {/foreach}
                        </div>
                        {/if}
                        {if is_array($vo.house['text']) && !empty($vo.house['text'])}
                        <div class="content2">
                                    <span class="icon">
                                    <img src="{$vo.house['icon']}" style="height: 50px;width: 50px;">
                                    </span>

                            <span class="title">你的{$vo.planet['name']}落于{$vo.house['name']}宫</span>
                            {foreach $vo.house['text'] as $text}
                            <div class="wenzi">
                                <p>{$text}</p><br><br>
                            </div>
                            {/foreach}
                        </div>
                        {/if}

                        <div class="luogong" style="margin-top: 24px;">
                            <span><img src="/static/astro_explain/images/标题style@2x.png" style="width: 10px;height: 15px;"></span><span
                                style="margin-left: 10px;margin-right: 10px;padding-bottom: 10px;font-size: 18px;color: #333333;">相位连接</span><span><img
                                src="/static/astro_explain/images/标题style@2x.png" style="width: 10px;height: 15px;"></span>
                        </div>
                        {if isset($phase_texts[$k]['text'][0]) && $phase_texts[$k]['text'][0]}
                        <!-- 没有形成相位需要在这里进行判断 -->
                        {if is_array($vo['phase']) && !empty($vo['phase'])}
                        {foreach $vo['phase'] as $voo}　
                        {if is_array($voo['text']) && !empty($voo['text'])}
                        <div class="xw_title">
                        <span style="position: relative;top: 5px;left: 20px;"><img src="{$voo['icon1']}"
                                                                                   style="height:20px;width:20px;"><img
                                src="{$voo['icon2']}" style="height:20px;width:20px;position: relative;left: -8px;"></span>
                            <span style="margin-left: 10%;">{$voo['name1']}与{$voo['name2']}成{$voo['degrees']}°相位</span>
                        </div>
                        {foreach $voo['text'] as $text}
                        <div class="xw_content">
                            <p>{$text}</p>
                        </div>
                        {/foreach}
                        {/if}
                        {/foreach}
                        <!-- 次要相位解读暂不做展示模块 -->
                        <div style="color: #333333;font-size: 14px;margin: 30px 0 10px;text-align: center;">
                            <p>说明：次要相位解读暂不展示。</p><br>
                        </div>
                        {/if}
                        {else/}
                        <!-- 没有形成相位需要在这里进行判断 -->
                        <div class="xw_content" style="width: auto;">
                            <p>{$vo.planet['name']}没有与任何行星形成主相位。</p><br><br>
                        </div>
                        {/if}
                    </div>
                </div>

            </div>
        </div>
        {/foreach}
    </div>
</div>

<script src="/static/astro_explain/js/swiper.min.js"></script>
<script src="/static/astro_explain/js/index.js"></script>

{include file="../apps/web/view/public/sensors.html" /}
</body>
</html>
